<template>
	<!-- <view class="fixbg" v-if="imageURL && imageURL!=''" :style="{'background-image' : 'url(' + imageURL + ')'}"> -->
		<view class="content">
			<!-- <view class="name">{{球状闪电}}</view> -->
			<scroll-view class="y_scroll" scroll-y="true" >
				<view v-for="item in book_content.data">
					<view class="content1" @click="nexttext(item.next_id)">{{item.content_name}}</view>
				</view>
			</scroll-view>
		</view>
	<!-- </view> -->
</template>

<script>
	export default {
		data() {
			return {
				book_content:[],
				imageURL:''
			}
		},
		onLoad() {
			this.getmbook(),
			this.getimage()
		},
		methods: {
			getmbook(){
				const db = uniCloud.database()
				const collection = db.collection('content')
				let res = collection.where({book_id: 1})
				.get()
				.then(res => {
					//调试，将内容打印到consolelog界面
					this.book_content = res.result
					console.log("动态书籍内容",res.result)
				})
			},
			getimage(){
				const db = uniCloud.database()
				const collection = db.collection('contentimage')
				let res = collection.where({bookid: 1})
				.get()
				.then(res => {
					//调试，将内容打印到consolelog界面
					this.imageURL = res.result.data[0].imageURL
					console.log("背景",this.imageURL)
				})
			},
			nexttext(e){
				console.log(e)
				uni.redirectTo({
					url:"../booktext/booktext?nextid=" + e 
				})
			}
		}
	}
</script>

<style>
	.content{
		height: 100%;/*屏幕大小750rpx * 1400rpx*/
		display: flex;
		flex-direction: column;
		/* top:calc(var(--window-top) + 10px) */
	}
	.name{
		height: 100%;
		font-size:100rpx;
		color:#000000;
		background-color:#4daa7f85;
		margin: 30rpx 20rpx 0rpx 0rpx;
	}
	.content1{
		height: 100%;
		font-size:60rpx;
		color:#000000;
		background-color:#88c3c885;
		margin: 30rpx 0rpx 0rpx 0rpx;/*上右下左*/
	}
</style>
